html{
    height: 100%;

}

body{
    height: 100%;
    background: url(../images/f1_1.jpg) no-repeat center 0 / cover;
    /* background-size: cover; */

}

/* 云 */
.cloud img{
    position: absolute;
    left: 50%;
}

.cloud img:nth-child(1){
    margin-left: -250px;
    top: 20px;
    animation: cloud 1s alternate linear infinite;

}

.cloud img:nth-child(2){
    margin-left: 400px;
    top: 100px;
    animation: cloud 1s linear alternate infinite  0.5s;

}

.cloud img:nth-child(3){
    margin-left: -550px;
    top: 200px;
    animation: cloud 1s linear alternate infinite 0.6s;

}

@keyframes cloud {
    100%{
        transform: translate(20px);
    }
}

/* 文字 */
.text img{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);

    animation: text 1s ;
}

@keyframes text {
    0%{
        transform: translate(-50%,-50%) scale(1);
    }
    20%{
        transform: translate(-50%,-50%) scale(0.1);
    }
    40%{    
        transform: translate(-50%,-50%) scale(1.4); 
    }
    60%{
        transform: translate(-50%,-50%) scale(0.8);
    }
    
    100%{
        transform: translate(-50%,-50%) scale(1);
    }
}


